<template>
  <div class="query-main">
    <div><strong>{{ $t('queryCriteria') }}</strong></div>
    <div class="query-box">
      <div>
      <slot>
        
      </slot>
      </div>
      <div><el-button @click="reset">{{ $t('reset') }}</el-button><el-button type="primary" @click="search">{{ $t('search') }}</el-button></div>
    </div>
    <el-divider/>
  </div>
</template>

<script>
export default {
  methods:{
    reset(){
      this.$emit('reset')
    },
    search(){
      this.$emit('search')
    }
  } 
}
</script>

<style scoped lang="less">
.query-main{
  padding:4px;
}
.query-box{
  margin-top:24px;
  display:flex;
  justify-content: space-between;
}
::v-deep{
  .el-divider{
    margin:8px 0;
  }
}
</style>